<ion-header>
    <ion-navbar color="dark">
        <ion-title>上证指数竞猜涨跌</ion-title>
    </ion-navbar>
</ion-header>

<ion-content overflow-scroll="false" style="overflow: hidden"  scroll="false">
    <!--轮播-->
    <ion-slides autoplay='2000'> 
        <ion-slide>
            <img class="shou_tu" src="assets/img/lun.png">
        </ion-slide>
        <ion-slide>
            <img class="shou_tu" src="assets/img/lun.png">
        </ion-slide>
        <ion-slide>
           <img class="shou_tu" src="assets/img/lun.png">
        </ion-slide>
    </ion-slides>
           
    <!--上证指数点位-->
    <div class="homeDate_dian">
        <h4>{{ huabi.month }}月{{ huabi.day }}日上证指数点位<span class="date_dw">{{huabi.shoupan}}</span></h4>
    </div>
  
    <!-- 竞猜 -->
    <!--开盘  -->
    <div *ngIf='isDate'>
            <!-- 竞猜pk数据层 -->
            <div class="homeDate_jing">
                <h5>{{ huabi.month }}月{{ huabi.day }}日上证指数开盘竞猜总奖金池</h5>
                <h3><span>{{ huabi.total }}</span>牛牛币</h3>
            </div>
            <!--外层-->
            <div padding >
                <!-- 状态条 -->
                <div class='homeDate_zhuang' style="overflow: auto;">
                    <div class="dib gaokai" style="width:50%;float:left;"></div>
                    <div class="dib dikai" style="width: 50%;float:right;"></div>
                </div>
                <!-- 文字 -->
                <div class="pt20">
                    <div class="w50">
                        <p><span class="gaokai_title">高开</span>{{ huabi.gaokai }}%</p>
                    </div>
                    <div class="w50">
                        <p class="vs"> vs</p>
                    </div>
                    <div class="w50">
                        <p class="text_right">{{ huabi.dikai }}%<span class="dikai_title">低开</span></p>
                    </div>
                </div>
                <!-- 收益 -->
                <div class="pt20" padding>
                    <div class="dib w50">
                        <p><span class="gaokai_title">1:{{ huabi.gaokaishouyibi }}</span></p>
                    </div>
                    <div class="w50">
                        <p class="svs"> 收益比</p>
                    </div>
                    <div class="dib w50">
                        <p class="text_right"><span class="dikai_title">1:{{ huabi.dikaishouyibi }}</span></p>
                    </div>
                </div>
                <!--高开低开-->
                <div class="ge_lv">
                        <div class="lv_cont1">
                            <div class="ying_left"  (click)="gaokai()">
                                <h5>高开</h5>
                            </div>
                        </div>
                        <div class="ge_ko">

                            距离竞猜结束还剩 
                            <span id="ten" style="color:red;display:block;">{{jie.daoji}}</span>
                            <!-- {{huabi.month}}月{{huabi.day}}日09：00竞猜截止。 -->
                        </div>
                        <div class="lv_cont2">

                            <div class="ying_right" (click)="dikai()">
                                <h5>低开</h5>
                            </div>
                        </div>
                </div>

            </div>
    </div>   
    <!--开盘结束显示  -->
    <div *ngIf='isDao' class="isdao">
            <!--上  -->
            <div class="dao_title">
                <h3>竞猜已结束</h3>
                <h5>总奖金池: <span>{{ huabi.total }}</span></h5>
            </div>
            <div class="dao_kan">
                    <div class="kan_cont1">
                        <div class="kan_left">
                            <h5>高开</h5><span>1:{{ huabi.gaokaishouyibi }}</span>
                        </div>
                        <hr class="kan_height">
                    </div>
                    <p class="dao_vs">
                        <span class="vs_dates">VS</span>
                    </p>
                    <div class="kan_cont2">
                        <hr class="right_height">
                        <div class="kan_right">
                            <h5>低开</h5><span>1:{{ huabi.dikaishouyibi }}</span>
                        </div>
                    </div>
            </div>
            <div class="weican">
                 <p>
                     您好，开盘猜涨在当天16：00至第二天9：00时间段可以竞猜。
                </p> 
            </div>
    </div>


    <!--结果显示  -->
    <div *ngIf='isKai_jie'>
           
            <h5 class="jie_title">{{ huabi.month }}月{{ huabi.day }}日大盘竞猜结果</h5>
            <div class="jie_bei">
                <div class="jie_shang">
                    <h4 class="jie_shang_left">{{jie.jieguo}}</h4><h4 class="jie_shang_right">{{jie.bili}}</h4>
                </div>
                <div class="jie_xia">
                    <h5 class="jiexia_title">本期我的总盈亏</h5>
                    <span class="jie_qianshu"><span style="font-size:2.3rem;">{{jie.qianshu}}</span>牛牛币</span>
                    <h5 class="jiexia_cha" (click)="ming()">查看明细></h5>
                </div>
           </div>
            <div class="jie_ll">
                 <p>竞猜赢取的牛牛币到账会有延迟，请耐心等待。</p>
                <span class="wei_time">下一轮竞猜将在{{jie.time}}进行</span>
            </div>
           
    </div>   



        <!--收盘  -->
        <div *ngIf='isShou'>
            <!-- 竞猜pk数据层 -->
            <div class="homeDate_jing">
                <h5>{{ huabi.month }}月{{ huabi.day }}日上证指数收盘竞猜总奖金池</h5>
                <h3><span>{{ huabi.total }}</span>牛牛币</h3>
            </div>
            <!--外层-->
            <div padding >
                <!-- 状态条 -->
                <div class='homeDate_zhuang' style="overflow: auto;">
                    <div class="dib gaokai" style="width:50%;float:left;"></div>
                    <div class="dib dikai" style="width: 50%;float:right;"></div>
                </div>
                <!-- 文字 -->
                <div class="pt20">
                    <div class="w50">
                        <p><span class="gaokai_title">看涨</span>{{ huabi.gaokai }}%</p>
                    </div>
                    <div class="w50">
                        <p class="vs"> vs</p>
                    </div>
                    <div class="w50">
                        <p class="text_right">{{ huabi.dikai }}%<span class="dikai_title">看跌</span></p>
                    </div>
                </div>
                <!-- 收益 -->
                <div class="pt20" padding>
                    <div class="dib w50">
                        <p><span class="gaokai_title">1:{{ huabi.gaokaishouyibi }}</span></p>
                    </div>
                    <div class="w50">
                        <p class="svs"> 收益比</p>
                    </div>
                    <div class="dib w50">
                        <p class="text_right"><span class="dikai_title">1:{{ huabi.dikaishouyibi }}</span></p>
                    </div>
                </div>
                <!--高开低开-->
                <div class="ge_lv">
                        <div class="lv_cont1">
                            <div class="ying_left"  (click)="gaokai()">
                                <h5>看涨</h5>
                            </div>
                        </div>
                        <div class="ge_ko">

                            距离竞猜结束还剩 
                            <span id="tens" style="color:red;display:block;">{{jie.daojis}}</span>
                            {{huabi.month}}月{{huabi.day}}日13：00竞猜截止。
                        </div>
                        <div class="lv_cont2">

                            <div class="ying_right" (click)="dikai()">
                                <h5>看跌</h5>
                            </div>
                        </div>
                </div>

            </div>
        </div>
        <!--收盘结束显示  -->
         <div *ngIf='isShous' class="isdao">
            <!--上  -->
            <div class="dao_title">
                <h3>竞猜已结束</h3>
                <h5>总奖金池: <span>{{ huabi.total }}</span></h5>
            </div>
            <div class="dao_kan">
                    <div class="kan_cont1">
                        <div class="kan_left">
                            <h5>看涨</h5><span>1:{{ huabi.gaokaishouyibi }}</span>
                        </div>
                        <hr class="kan_height">
                    </div>
                    <p class="dao_vs">
                        <span class="vs_dates">VS</span>
                    </p>
                    <div class="kan_cont2">
                        <hr class="right_height">
                        <div class="kan_right">
                            <h5>看跌</h5><span>1:{{ huabi.dikaishouyibi }}</span>
                        </div>
                    </div>
            </div>
            <div class="weican">
                 <p>
                     您好，收盘猜涨跌在当天10：00至13：00时间段可以竞猜。
                </p> 
            </div>

        </div>
        <!-- 收盘结果 -->
        <!-- <div *ngIf='isShou_jie'>

        </div> -->

            <!--搞开-->
            <div class="scrizzs" >
                <div>  
             <div class="zhe_ceng">
                            <div class="gao_title"  (click)="gaokai()">
                                <h5 id='isGao' class="gao_zhang">{{huabi.cai}}</h5>
                            </div>
                            <form action="" >
                                <input class="gao_money" [(ngModel)]='GKM' name="gk" type="text" placeholder="请输入下注金额">
                                <div >
                                    <button class="jisuan" (click)='si()'>50</button >
                                    <button class="jisuan" (click)='ban()'>100</button>
                                    <button class="jisuan" (click)='man()'>500</button>
                                </div>
                                <ul class="keyong">
                                    <li>
                                        <h5>可用牛牛币</h5>
                                        <span id="ke_money">{{huabi.money}}</span>
                                    </li>
                                </ul>
                                <button class="xiazhu"  (click)='reqGk()'>立即下注</button>
                            </form>
                        <div class="guan" (click)="backdropclick($event)">
                            <span>X</span>
                        </div>
                    </div>
                </div>
            </div>
        <!--低开-->
       <div class="scrizz" >
        <div>
                    <div class="zhe_ceng">
                            <div class="gao_title"  (click)="gaokai()">
                                <h5  class="di_die">{{huabi.cai2}}</h5>
                            
                            </div>
                            <form action="" >
                                <input class="gao_moneys" [(ngModel)]='DKM'  name='dk' type="text"  placeholder="请输入下注金额">
                                <div >
                                    <button class="jisuan" (click)='sis()'>50</button >
                                    <button class="jisuan" (click)='bans()'>100</button>
                                    <button class="jisuan" (click)='mans()'>500</button>
                                </div>
                                <ul class="keyong">
                                    <li>
                                        <h5>可用牛牛币</h5>
                                        <span id="ke_money">{{huabi.money}}</span>
                                    </li>
                                </ul>
                                <button class="xiazhu" (click)='reqDk()'>立即下注</button>
                            </form>
                        <div class="guan" (click)="backdropclick($event)">
                            <span>X</span>
                        </div>
                    </div>
                </div>
            </div>
    

   
</ion-content>
